<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="d">	
				F:\1_javaCode_ideaWorkspace\web\element\01_ele\t-jsd-03-master\Web\day06
			<ul>
				<!--v-for循环遍历指令, 写在哪个标签里面 就会重复生成此标签,生成的数量和数组中元素的数量一致-->
				<li v-for="name in arr">{{name}}</li>
			</ul>
			<table border="1"  style="border-collapse: collapse;">
				<caption>任务列表</caption>
				<tr>
				      <th>编号</th><th>名字</th><th>年龄</th><th>性别</th>
				</tr>
				<tr v-for="(p,i)  in  persons">
					<td>{{i+1}}</td>
					<td>{{p.name}}</td>
					<td>{{p.age}}</td>
					<td>{{p.gender}}</td>
				</tr>
			</table>
		</div>
	</body>
	<script src="vue.min.js"></script>
	<script>
		var v=new Vue({
			el: "#d",
			data:{
				result:"",
				arr:['刘德华',"郭富城"],
				persons:[
					{name:"张三",age:18,gender:"男"},
					{name:"李四",age:18,gender:"女"}
				]
			}
		});
	</script>
</html>
